<template>
  <!-- 入库单明细 -->
  <div>
    <FilterTable
      ref="table"
      :columns="columns"
      :dataSource="dataSource"
      columnsRef="lxjczclglinstockTable"
      :isSelectColumn="false"
      :isColumnFilter="false"
      :onColumnsChange="columns => (this.columns = columns)"
    ></FilterTable>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'center'
      }"
    >
      <el-button type="primary" icon="el-icon-download" @click="excelDetail">EXCEL</el-button>
      <el-button @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { queryDetail, excelDetail } from '@/api/finance/partFinance/invoiceRegister';
import { exportExcelFile } from '@/utils/index';
import { log } from 'util';

export default {
  name: 'instockModel',
  components: {},
  props: {
    resData: {      // 上个页面选中行的数据
      type: Array,
      default: []
    },
    resPar: {      // 上个页面选中行的数据
    }
  },
  data() {
    return {
      dataSource: [],
      columns: this.createTableColumns() // 列表字段
    };
  },
  computed: {},
  watch: {},
  created() { },
  mounted() {
    this.detail();
  },
  methods: {
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          fixed: 'left',
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '仓库',
          dataIndex: 'STORAGE_CODE',
          width: 150,
          sorter: true
        },
        {
          title: '库位',
          dataIndex: 'STORAGE_POSITION_CODE',
          width: 150,
          sorter: true
        },
        {
          title: '备件代码',
          dataIndex: 'PART_NO',
          width: 150,
          sorter: true
        },
        {
          title: '备件名称',
          dataIndex: 'PART_NAME',
          width: 150,
          sorter: true
        },
        {
          title: '计量单位',
          dataIndex: 'UNIT',
          width: 150,
          sorter: true
        },
        {
          title: '入库数量',
          dataIndex: 'IN_QUANTITY',
          width: 150,
          sorter: true
        },
        {
          title: '不含税单价',
          dataIndex: 'IN_PRICE',
          width: 150,
          sorter: true
        },
        {
          title: '不含税金额',
          dataIndex: 'IN_AMOUNT',
          width: 150,
          sorter: true
        },
        {
          title: '含税单价',
          dataIndex: 'IN_PRICE_TAXED',
          width: 150,
          sorter: true
        },
        {
          title: '含税金额',
          dataIndex: 'IN_AMOUNT_TAXED',
          width: 150,
          sorter: true
        },
      ];
    },
    closeDialog() {
      this.$emit('close');
    },
    // 查询明细
    async detail() {
      if (this.resData[0].INVOICE_NO === null) {  // 发票号没值， 就没明细
        this.$message.warning("还没明细");
        return
      } else {
        let tag = this.resPar.tag     // 采购入库 、、 tag
        let id = this.resData[0].ID   // 关联明细表的ID
        let saveData = { tag: tag, id: id }    // 参数

        const res = await queryDetail(saveData)     //  查询明细的后台方法
        console.log(res.data)
        this.dataSource = res.data
        this.dataSource = [...this.dataSource]

      }
    },
    async excelDetail() {
      if (this.resData[0].INVOICE_NO === null) {  // 发票号没值， 就没明细
        this.$message.warning("没值无法导出");
        return
      } else {
        let tag = this.resPar.tag     // 采购入库 、、 tag
        let id = this.resData[0].ID   // 关联明细表的ID
        let saveData = { tag: tag, id: id }    // 参数

        excelDetail(saveData).then(res => {     //  明细导出的后台方法
          exportExcelFile(res, '明细');
        });
      }
    }
  }

};
</script>
<style lang="less" scoped></style>
